/**
* 功能描述: 基础复选按钮样式Demo页面
* @author 赵常畅
* @date 2022/9/22 17:02
* @version 1.0
*/
<template>
  <label class="yw-check-button-wrapper yw-check-button-wrapper-checked">
    <span class="yw-check-button">
      <input type="checkbox" class="yw-check-button-input" value="a">
      <span class="yw-check-button-inner"></span>
    </span>
    <span>Hangzhou</span>
  </label>
  <label class="yw-check-button-wrapper">
    <span class="yw-check-button">
      <input type="checkbox" class="yw-check-button-input" value="b">
      <span class="yw-check-button-inner"></span>
    </span>
    <span>Shanghai</span>
  </label>
  <label class="yw-check-button-wrapper yw-check-button-wrapper-disabled">
    <span class="yw-check-button">
      <input type="checkbox" class="yw-check-button-input" value="c">
      <span class="yw-check-button-inner"></span>
    </span>
    <span>Beijing</span>
  </label>
  <label class="yw-check-button-wrapper yw-check-button-wrapper-large">
    <span class="yw-check-button">
      <input type="checkbox" class="yw-check-button-input" value="d">
      <span class="yw-check-button-inner"></span>
    </span><span>large</span>
  </label>
  <label class="yw-check-button-wrapper yw-check-button-wrapper-small">
    <span class="yw-check-button">
      <input type="checkbox" class="yw-check-button-input" value="d">
      <span class="yw-check-button-inner"></span>
    </span><span>small</span>
  </label>
</template>

<script>
export default {
  name: "index"
}
</script>

<style scoped>
.yw-check-button-wrapper {
  margin: 10px;
}
</style>
